<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" >
    <title>联赛首页</title>
    <!--<link rel="stylesheet" href="../../css/bootstrap.min.css"/>-->
    <!--<link rel="stylesheet" href="../../css/public.css">-->
    <!--<link rel="stylesheet" type="text/css" href="../../css/league-index.css">-->
    <!--<link rel="stylesheet" type="text/css" href="../../fonts/iconfont.css">-->


    <!-- styles needed by jScrollPane - include in your own sites -->
    <link type="text/css" href="../../css/jquery.jscrollpane.css" rel="stylesheet" media="all" />
    <script src="../../js/jquery.min.js"></script>
    <script src="../../js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../../js/jquery.mousewheel.js"></script>
    <script type="text/javascript" src="../../js/jquery.jscrollpane.min.js"></script>

    <style>
        #container {
            width: 760px;
            background: #eeeef4;
            /*padding: 20px;*/
            margin: 20px auto;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
        }
        .scroll-pane
        {
            width: 100%;
            height: 200px;
            overflow: auto;
        }
        .horizontal-only
        {
            height: auto;
            max-height: 200px;
        }

    </style>
</head>
<body>

    <div id="container">
        <div class="scroll-pane horizontal-only">
            <p style="width: 1000px;">Vivamus  hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus  rhoncus ut eleifend nibh porttitor. Ut in nulla enim. Phasellus molestie  magna non est bibendum non venenatis nisl tempor. Suspendisse dictum  feugiat nisl ut dapibus.</p>
        </div>
    </div>

</body>
<script>
    $(function() {
        $('.scroll-pane').jScrollPane()
    });
</script>
</html>